<template>
  <div class="app-container bg-transparent">
    <info-card :info="eventInfo" />
    <div class="flex mt20">
      <flow :event-id="id" class="event-flow" />
      <div class="event-others">
        <related-task :info="eventInfo" class="event-related-task" />
        <files :event-id="id" class="event-files mt20" />
      </div>
    </div>
  </div>
</template>

<script>
// import { getRole } from '@/api/system/role'
import InfoCard from './event-components/EventInfoCard'
import Flow from './event-components/EventFlow'
import RelatedTask from './event-components/EventRelatedTask'
import Files from './event-components/EventFiles'

export default {
  name: 'EventDetail',
  components: { InfoCard, Flow, RelatedTask, Files },
  props: {
    certNo: {
      type: String,
      required: true
    },
    id: {
      type: String,
      required: true
    }
  },
  data() {
    return {
      loading: true,
      eventInfo: {}
    }
  },
  created() {
    this.loadData()
  },
  methods: {
    /** 查询客户详细信息 */
    loadData() {
      this.loading = true
      // getRole(parseInt(this.id)).then(res => {
      //   this.clientInfo = res.data
      //   this.loading = false
      // })
    }
  }
}
</script>
<style lang="scss" scoped>
  .event-flow {
    width: 50%;
  }
  .event-others {
    margin-left: 20px;
    flex-grow: 2;
  }
</style>
